    require("../less/trainclass.less")




    /* 需求: 鼠标移入菜单li,
    1> 为当前移入的菜单添加激活样式(添加类名active)
    2> 显示当前菜单对应的内容p */

    let li = document.querySelectorAll('#sportstabMenu li')
    let p = document.querySelectorAll('#sportstabText p')
    console.log(p);
    //保存上一个菜单的索引
    let index = 0;

    //遍历
    li.forEach(function (v, i) {
        //console.log( v ); 代表所有li

        //注册事件
        v.addEventListener('mouseover', function () {
            //console.log( v );//代表当前移入的li
            //console.log( this );//代表当前移入的li

            li[index].className = ''//先-清除上一个菜单的激活样式
            this.className = 'active'//给当前菜单添加激活样式-添加类名active

            p[index].className = ''//先-隐藏原来内容-清空类名
            p[i].className = 'on'//显示当前菜单对应的内容p

            index = i//将当前索引赋值给index

        })

    })